<template>
    <view class="columnbox wdh-100 content">
        <view class="columnbox one-info" style="padding-bottom: 0;">
            <view class="rowbox wdh-100 jus  info-box" style="margin-top: 0;">
                <view class="info-title">姓名</view>
                <view>{{info.name}}</view>
            </view>
            <view class="rowbox wdh-100 jus info-box">
                <view class="info-title">性别</view>
                <view>{{info.sex==1?'男':'女'}}</view>
            </view>
            <view class="rowbox wdh-100 jus info-box">
                <view class="info-title">年龄</view>
                <view>{{info.age}}</view>
            </view>
        </view>
        <view class="columnbox one-info">
            <view class="rowbox wdh-100 jus  info-box" style="margin-top: 0;">
                <view class="info-title">诊断</view>
            </view>
            <view class="wdh-100 rowbox spb zd-box">
                <view style="width: 500rpx;">{{info.zhenduan}}</view>
            </view>
        </view>
        <view class="columnbox one-info">
            <view class="rowbox wdh-100 jus  info-box" style="margin-top: 0;">
                <view class="info-title">现病史</view>
            </view>
            <view class="info-detail">{{info.xianbingshi}}</view>
        </view>
        <view class="columnbox one-info">
            <view class="rowbox wdh-100 jus  info-box" style="margin-top: 0;">
                <view class="info-title">既往史</view>
            </view>
            <view class="info-detail">{{info.jiwangshi}}</view>
        </view>
        <view class="columnbox one-info">
            <view class="rowbox wdh-100 jus  info-box" style="margin-top: 0;">
                <view class="info-title" style="width: 200rpx;">体检辅查</view>
            </view>
            <view class="wdh-100 rowbox spb zd-box">
                <view class="tijian-list">
                    <view>身高：{{info.shengao}}cm</view>
                    <view>体重：{{info.tizhong}}kg</view>
                    <view>体温：{{info.tiwen}}°C</view>
                    <view>心率：{{info.xinlu}}bpm</view>
                    <view>收缩压：{{info.shousuoya}}mmHg</view>
                    <view>舒张压：{{info.shuzhangya}}mmHg</view>
                </view>
            </view>
        </view>
        <view class="columnbox one-info">
            <view class="rowbox wdh-100 spb  info-box" style="margin-top: 0;">
                <view class="info-title" style="width: 200rpx">处理意见</view>
            </view>
            <view class="info-detail">{{info.yijian}}</view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                id: 0,
                info: '',
            };
        },
        onLoad(options) {
            this.id = options.id * 1
            this.getDetail()
        },
        methods: {
            getDetail() {
                this.$req.post('/user/bingliinfo', {
                    id: this.id
                }).then(res => {
                    this.info = res.data.data
                })
            }
        }
    }
</script>
<style lang="scss" scoped>
    .content {
        background: #F5F8FB;
        min-height: 100vh;
        justify-content: flex-start;
        font-family: PingFang SC;
        padding-bottom: 20rpx;
    }

    .one-info {
        width: 710rpx;
        padding: 32rpx 40rpx;
        background: #fff;
        border-radius: 20rpx;
        margin-top: 20rpx;
        font-size: 28rpx;
    }

    .info-box {
        font-size: 28rpx;
        border-bottom: #f6f7fb solid 1px;
        padding-bottom: 32rpx;
        margin-top: 20rpx;
        color: #202020;
    }

    .info-title {
        color: #333333;
        width: 90rpx;
    }

    .one-info>view:last-child {
        border: none;
    }

    .zd-box {
        margin-top: 32rpx;
        font-size: 28rpx;
    }

    .info-detail {
        width: 100%;
        font-size: 28rpx;
        margin-top: 20rpx;
    }

    .tijian-list {
        width: 600rpx;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;

        view {
            padding: 10rpx 20rpx;
            color: #00b6b2;
            background: rgba(#00b6b2, .07);
            font-size: 28rpx;
            line-height: 40rpx;
            border-radius: 100rpx;
            margin-right: 20rpx;
            width: fit-content;
            margin-bottom: 10rpx;
        }
    }
</style>